// createWebHistory
import { createRouter, createWebHashHistory, RouteRecordRaw } from 'vue-router'
import Layout from '@/Layout/index.vue'
// 看作是异步获取路由
// export const asyncRoutes: Array<RouteRecordRaw> = [
//   { // 404一定放在要在最后面
//     path: '/:pathMatch(.*)*',
//     redirect: '/404'
//   }
// ]

export const constantRoutes: Array<RouteRecordRaw> = [
  {
    path: '/',
    redirect: '/home'
  },
  {
    path: '/home',
    name: 'Home',
    component: () => import(/* webpackChunkName: "Home" */ '@/views/home/index.vue')
  },
  {
    path: '/post',
    component: Layout,
    redirect: '/post',
    children: [
      {
        path: '/post',
        name: 'Post',
        component: () => import(/* webpackChunkName: "Post" */ '@/views/post/index.vue')
      }
    ]
  },
  {
    path: '/detail',
    component: Layout,
    redirect: '/detail',
    children: [
      {
        path: '/detail',
        name: 'Detail',
        component: () => import(/* webpackChunkName: "Post" */ '@/views/detail/index.vue')
      }
    ]
  },

  {
    path: '/login',
    name: 'Login',
    component: () => import(/* webpackChunkName: "login" */ '@/views/login/index.vue')
  },
  {
    path: '/redirect',
    component: Layout,
    name: 'Redirect',
    children: [
      { // 带参数的动态路由正则匹配
        path: '/redirect/:path(.*)', // 要匹配多级路由 应该加*号
        component: () => import('@/views/redirect/index.vue')
      }
    ]
  },
  {
    path: '/401',
    component: Layout,
    name: '401Layout',
    children: [
      {
        path: '',
        component: () => import('@/views/error-page/401.vue')
      }
    ]
  },
  {
    path: '/404',
    component: () => import('@/views/error-page/404.vue')
  }
]
// export const routes = [
//   ...constantRoutes,
//   ...asyncRoutes
// ]
export const routes = constantRoutes

const router = createRouter({
  history: createWebHashHistory(),
  routes
})

export default router
